/*
 * @Author: Lin Hongwei
 * @Date: 2022-10-09 09:38:50
 * @LastEditTime: 2022-11-05 10:56:58
 * @LastEditors: Lin Hongwei
 * @email: 1365755396@qq.com
 * @CSDN: https://blog.csdn.net/weixin_45429409
 * @Description: 任务搜索框
 */
import { Button, Input } from "antd";
import { useState } from "react";
import { Row } from "../../../components/lib";
import { TaskTypeSelect } from "../../../components/task-type-select";
import { UserSelect } from "../../../components/user-select";
import { useSetURLSearchParams } from "../../../hooks/url";
import { useTaskSearchParams } from "./utils";

export const TaskSearchPanel = () => {
  const [inputValue, setInputValue] = useState("");
  const searchParam = useTaskSearchParams();
  const setUrlSearchParams = useSetURLSearchParams();
  const handleReset = () => {
    setUrlSearchParams({
      name: undefined,
      processorId: undefined,
      typeId: undefined,
    });
    setInputValue("");
  };

  return (
    <Row marginBottom={4} gap={true}>
      <Input
        style={{ width: "20rem" }}
        placeholder="任务名"
        value={inputValue}
        onChange={(e) => {
          setInputValue(e.target.value);
          setUrlSearchParams({ name: e.target.value });
        }}
      />
      <UserSelect
        defaultName="经办人"
        value={searchParam.processorId}
        onChange={(processorId) => setUrlSearchParams({ processorId })}
      />
      <TaskTypeSelect
        defaultName="任务类型"
        value={searchParam.typeId}
        onChange={(typeId) => setUrlSearchParams({ typeId })}
      />
      <Button onClick={handleReset}>重置</Button>
    </Row>
  );
};
